<template>
  <div>
    <el-form :inline="true" size="mini" :model="formInline" class="demo-form-inline">
      <el-form-item label="住院号">
        <el-input v-model="formInline.user"></el-input>
      </el-form-item>
      <el-form-item label="患者姓名">
        <el-input v-model="formInline.user"></el-input>
      </el-form-item>
      <el-form-item label="申请编号">
        <el-input v-model="formInline.user"></el-input>
      </el-form-item>
      <el-form-item label="血袋编号">
        <el-input v-model="formInline.user"></el-input>
      </el-form-item>
      <el-form-item label="所在病区">
        <el-select v-model="formInline.user" placeholder="活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-form :inline="true" size="mini" :model="formInline" class="demo-form-inline">
      <el-form-item label="开始时间">
        <el-date-picker v-model="formInline.user" type="date" placeholder="选择日期"></el-date-picker>
      </el-form-item>
      <el-form-item label="截止时间">
        <el-date-picker v-model="formInline.user" type="date" placeholder="选择日期"></el-date-picker>
      </el-form-item>
      <el-form-item label="时间范围">
        <el-select v-model="formInline.user" placeholder="活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="对应科室">
        <el-select v-model="formInline.user" placeholder="活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="血液成分">
        <el-select v-model="formInline.user" placeholder="活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-form :inline="true" size="mini" :model="formInline" class="demo-form-inline">
      <el-form-item label="取血条码">
        <el-input v-model="formInline.user"></el-input>
      </el-form-item>
      <el-form-item label="血液大类">
        <el-select v-model="formInline.user" placeholder="活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary">查询</el-button>
        <el-button type="primary">发血</el-button>
        <el-button type="primary">移出</el-button>
        <el-button type="primary">待发血</el-button>
      </el-form-item>
    </el-form>
    <el-tabs type="border-card">
      <el-tab-pane label="科室发血">
        <el-table :data="orgTableData" :height="tabHeight" border style="width: 100%">
          <el-table-column prop="date" label="配血样本号" width="180"></el-table-column>
          <el-table-column prop="date" label="血袋编号" width="180"></el-table-column>
          <el-table-column prop="date" label="状态"></el-table-column>
          <el-table-column prop="date" label="科室"></el-table-column>
          <el-table-column prop="date" label="病区"></el-table-column>
          <el-table-column prop="date" label="病人编号"></el-table-column>
          <el-table-column prop="date" label="性别"></el-table-column>
          <el-table-column prop="date" label="年龄"></el-table-column>
          <el-table-column prop="date" label="血型"></el-table-column>
          <el-table-column prop="date" label="血液成分"></el-table-column>
          <el-table-column prop="date" label="血袋血型"></el-table-column>
          <el-table-column prop="date" label="规格"></el-table-column>
          <el-table-column prop="date" label="配血方法"></el-table-column>
          <el-table-column prop="date" label="配血结果"></el-table-column>
          <el-table-column prop="date" label="申请单号"></el-table-column>
          <el-table-column prop="date" label="配血时间"></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="已发血清单"></el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
export default {
  data() {
    return {
      formInline: {
        user: "",
      },
      orgTableData: [
        {
          date: "1",
        },
      ],
      tabHeight: window.innerHeight - 38*3 -56-20-61-39-40,
    };
  },
};
</script>
<style lang="less" scoped>
.el-form {
  height: 38px;
}
.demo-form-inline{
  .el-date-editor{
    width: 180px;
  }
}
</style>